<template>
    <div>
        <!--头部导航-->
        <TypeNav />
        <!--列表-->
        <ListContainer />
        <!--今日推荐-->
        <TodayRecommend />
        <!-- 商品排行 -->
        <Rank />
        <!-- 猜你喜欢 -->
        <Like />
        <!--楼层-->
        <Floor v-for="item in floors" :key="item.id" :floor="item" />
        <!--商标-->
        <Brand />
    </div>
</template>

<script>
import Brand from "./components/Brand";
import ListContainer from "./components/ListContainer";
import Floor from "./components/Floor";
import Like from "./components/Like";
import Rank from "./components/Rank";
import TodayRecommend from "./components/TodayRecommend";
import { mapActions, mapState } from "vuex";

export default {
    name: "Home",
    components: {
        Brand,
        ListContainer,
        Floor,
        Like,
        Rank,
        TodayRecommend,
    },
    methods: {
        // 获取楼层数据
        ...mapActions("floor", ["getFloors"]),
    },
    computed: {
        // 获取楼层数据
        ...mapState("floor", ["floors"]),
    },
    mounted() {
        // 获取楼层数据
        this.getFloors();
    },
};
</script>

<style scoped lang="less"></style>
